
var headbg = '#cccccc';  // table heading background colour
var todaybg = '#99cccc'; // current day of month background colour
var textclr = '#009999'; // text colour

var pageLoaded = 0;
window.onload = function()
{
	pageLoaded = 1;
}

function read() {
	var id = location.toString(); 
	id = id.slice(id.lastIndexOf("?") + 4);
	display(id);
}

function display(id) {
	var stringOut = "<img src=\"Image/koleksi foto/" + id + ".jpg\" width='400' height='300' />";
	document.getElementById("photoDetails").innerHTML = stringOut;
}

function loaded(i,f)
{
	if (document.getElementById && document.getElementById(i) != null)
		f();
	else if (!pageLoaded)
		setTimeout('loaded(\''+i+'\','+f+')',100);
}

function monthlength(month,year) 
{
	var dd = new Date(year, month, 0);
	return dd.getDate();
}

var moy = ['January','February','March','April','May','June','July','August','September','October','November','December'];
var mon = ['01','02','03','04','05','06','07','08','09','10','11','12'];
var days = ['01','02','03','04','05','06','07','08','09','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30','31'];

function dispCal(yy,mm)
{
	if (mm < 0 || mm > 12)
	{
		alert('month must be between 1 and 12');
		return false;
	}
	if (yy != 0 && (yy < 1901 || yy > 2100))
	{
		alert('year must be after 1900 and before 2101');
		return false;
	}
	
	var dow = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];
	var calendar = new Date();
	var today = calendar.getDate();
	calendar.setDate(1);
	
	if (yy > 1900)
		calendar.setFullYear(yy);
		
	if (mm > 0)
		calendar.setMonth(mm - 1);
	
	var yy = year = calendar.getFullYear();
	var month = calendar.getMonth();
	calendar.setDate(today);
	var weekday = calendar.getDay();
	var daysInMonth = monthlength(month+1,year);
	var hilite_start = '<td width="30" style="background:' + todaybg + '" align="center"><b>';
	var td_start = '<td width="30" align="center">';
	var cal = '<div id="cal"><div style="border:1pt solid #cccccc;height:190px;width:238px"><table border="0" cellspacing="0" cellpadding="2"><tr><td colspan="7" style="background:' + headbg + '" align="center"><b>' + moy[month]  + ' ' + year + '<\/b><\/td><\/tr><tr>';
	for(dex=0; dex < 7; dex++)
	{
		if(weekday == dex)
			cal += td_start + '<b>' + dow[dex] + '<\/b><\/td>'; 
			
		else
			cal += td_start + dow[dex] + '</td>';
	}
	
	cal += '<\/tr><tr>';
	var day2 = today;
	
	for (dex = today; dex > 6; dex -=7)
		day2 = dex;
	
	weekday -= day2 - 1;
	
	while (weekday < 0) 
		weekday += 7;
		
	for(dex=0; dex < weekday; dex++)
		cal += td_start + ' <\/td>';
	
	for(dex=1; dex <= daysInMonth; dex++)
	{
		if(weekday == 7)
		{
			cal += '</tr><tr>';
			weekday = 0;
		}
		if(today==dex)
			cal += hilite_start +'<a style="text-decoration:none;color:'+textclr+'" href="#" onclick="setDate(' + dex + ',' + month + ',' + year + ')">' + dex + '<\/a><\/b><\/td>';
		
		else
			cal += td_start + '<a style="text-decoration:none;color:'+textclr+'" href="#" onclick="setDate(' + dex + ',' + month + ',' + year + ')">' + dex + '<\/a><\/td>';
		
		weekday += 1;
	}
	
	for(dex=weekday; dex < 7; dex++)
		cal += td_start + ' <\/td>';
		
	cal += '<\/tr><\/table><\/div>';
	
	if (document.getElementById)
	{
		var mmb = month;
		mm = month + 1;
		var yya = yyb = yy;
		if (mmb <1)
		{
			mmb += 12;
			yyb--;
		}
		var mma = month + 2;
		if (mma > 12)
		{
			mma -= 12;
			yya++;
		}
		var yb = yy -1;
		var ya = yy +1;
		cal += '<table border="0" cellspacing="0" cellpadding="2" width="210"><tr><td><a href="#" onclick="if (cala = dispCal('+yb+','+mm+')) {document.getElementById(\'cal\').innerHTML = cala; return false;}"><<</a></td><td><a href="#" onclick="if (cala = dispCal('+yyb+','+mmb+')) {document.getElementById(\'cal\').innerHTML = cala; return false;}"><</a></td><td align="right"><a href="#" onclick="if (cala = dispCal('+yya+','+mma+')) {document.getElementById(\'cal\').innerHTML = cala; return false;}">></a></td><td align="right"><a href="#" onclick="if (cala = dispCal('+ya+','+mm+')) {document.getElementById(\'cal\').innerHTML = cala; return false;}">>></a></td></tr></table>';
	}
	else
	{
		cal += '<div> </div>';
	}
	cal += '</div>';
	return cal;
}

function start()
{
	document.getElementById('calendar').innerHTML = dispCal(0,0);
}

loaded('calendar',start);

function setDate(dayVal,monthVal,yearVal)
{
	document.getElementById('calDate').value = yearVal + '-' + mon[monthVal] + '-' + days[dayVal - 1];
}

function changeThemes(){
	links = document.getElementsByTagName('link');
	if (links[0].getAttribute('href') == 'css/css1/themes1.css')
	{
		links[0].setAttribute('href','css/css2/themes2.css');
		tombol1 = document.getElementById('signup');
		tombol1.setAttribute('style','top:200px');
		tombol1.setAttribute('src','Image/themes2/signup2.png');
		tombol1.setAttribute('href','FormRegistrasi.html');
		tombol2 = document.getElementById('upload');
		tombol2.setAttribute('style',"top:255px");
		tombol2.setAttribute('src','Image/themes2/uploadphotos2.png');
		tombol2.setAttribute('href','UploadPhotos1.html');
		tombol3 = document.getElementById('album');
		tombol3.setAttribute('style',"top:310px");
		tombol3.setAttribute('src','Image/themes2/photoalbums2.png');
		tombol3.setAttribute('href','PhotoAlbums1.html');
		tombol4 = document.getElementById('changes');
		tombol4.setAttribute('style','top:365px');
		tombol4.setAttribute('src','Image/themes2/button change 2.png');
		tombol4.setAttribute('href','#');
		tombol4.setAttribute('onclick','changeThemes');
		tombol5 = document.getElementById('about');
		tombol5.setAttribute('style','top:420px');
		tombol5.setAttribute('src','Image/themes2/about2.png');
		tombol6 = document.getElementById('header');
		tombol6.setAttribute('src','Image/themes2/headerthemes2 copy.png');
	}
	else
	{
		links[0].setAttribute('href','css/css1/themes1.css');
		tombol1 = document.getElementById('signup');
		tombol1.setAttribute('style','left:230px');
		tombol1.setAttribute('src','css/css1/signup1.png');
		tombol1.setAttribute('href','FormRegistrasi.html');
		tombol2 = document.getElementById('upload');
		tombol2.setAttribute('style',"left:370px");
		tombol2.setAttribute('src','css/css1/upload1.png');
		tombol2.setAttribute('href','UploadPhotos1.html');
		tombol3 = document.getElementById('album');
		tombol3.setAttribute('style',"left:490px");
		tombol3.setAttribute('src','css/css1/photoalbums1.png');
		tombol3.setAttribute('href','PhotoAlbums1.html');
		tombol4 = document.getElementById('changes');
		tombol4.setAttribute('style','left:625px');
		tombol4.setAttribute('src','css/css1/changthemes1.png');
		tombol4.setAttribute('href','#');
		tombol4.setAttribute('onclick','changeThemes');
		tombol5 = document.getElementById('about');
		tombol5.setAttribute('style','left:750px');
		tombol5.setAttribute('src','css/css1/about1.png');
		tombol6 = document.getElementById('header');
		tombol6.setAttribute('src','css/css1/header copy.png');
	}
}

function changeSignUp(){
	links = document.getElementsByTagName('link');
	if (links[0].getAttribute('href') == 'css/css1/themes1.css')
	{
		tombol1 = document.getElementById('tulisan');
		tombol1.setAttribute('style','position:absolute; left: 250px; top: 300px;');
	}
	else
	{
		tombol1 = document.getElementById('tulisan');
		tombol1.setAttribute('style','left:400px; position:absolute;');
		var stringOut = "<br/><br/><br/><br/>";
		document.getElementById("breakline").innerHTML = stringOut;
	}
}

function changeUpload(){
	links = document.getElementsByTagName('link');
	if (links[0].getAttribute('href') == 'css/css1/themes1.css')
	{
		tombol1 = document.getElementById('tulisan1');
		tombol1.setAttribute('style','position:absolute; left: 250px; top: 300px;');
		tombol2 = document.getElementById('komenupload1');
		tombol2.setAttribute('style','left: 950px;');
		tombol3 = document.getElementById('komenupload2');
		tombol3.setAttribute('style','left: 950px;');
		tombol4 = document.getElementById('komenupload3');
		tombol4.setAttribute('style','left: 1030px;');
	}
	else
	{
		tombol1 = document.getElementById('tulisan1');
		tombol1.setAttribute('src','css/css2/Untitled-1.png');
		tombol1.setAttribute('style','left:400px; position:absolute;');
		//var stringOut = "<br/><br/><br/>";
		//document.getElementById("breakline").innerHTML = stringOut;
		tombol2 = document.getElementById('komenupload1');
		tombol2.setAttribute('style','left: 780px;');
		tombol3 = document.getElementById('komenupload2');
		tombol3.setAttribute('style','left: 780px;');
		tombol4 = document.getElementById('komenupload3');
		tombol4.setAttribute('style','left: 880px;');
	}
	}

function changeKomen(){
	links = document.getElementsByTagName('link');
	if (links[0].getAttribute('href') == 'css/css2/themes2.css')
	{
		tombol1 = document.getElementById('labelkomen1');
		tombol1.setAttribute('style','left:780px');
	    tombol2 = document.getElementById('inkomen1');
		tombol2.setAttribute('style','left:930px');
		tombol3 = document.getElementById('labelkomen2');
		tombol3.setAttribute('style','left:780px');
	    tombol4 = document.getElementById('inkomen2');
		tombol4.setAttribute('style','left:930px');
		tombol5 = document.getElementById('labelkomen3');
		tombol5.setAttribute('style','left:780px');
	    tombol6 = document.getElementById('inkomen3');
		tombol6.setAttribute('style','left:930px');
		tombol7 = document.getElementById('labelkomen4');
		tombol7.setAttribute('style','left:780px');
	    tombol8 = document.getElementById('inkomen4');
		tombol8.setAttribute('style','left:930px');
	    tombol9 = document.getElementById('inkomen5');
		tombol9.setAttribute('style','left:930px');
	}
}